<!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <title>Cloud Admin | Tree View</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no">
    <meta name="description" content="">
    <meta name="author" content="">
    <!-- STYLESHEETS --><!--[if lt IE 9]>
    <script src="${CONTEXT_PATH}/_back/CloudAdmin/js/flot/excanvas.min.js"></script>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script><![endif]-->
    <link rel="stylesheet" type="text/css" href="${CONTEXT_PATH}/_back/CloudAdmin/css/cloud-admin.css">
    <link rel="stylesheet" type="text/css" href="${CONTEXT_PATH}/_back/CloudAdmin/css/themes/default.css"
          id="skin-switcher">
    <link rel="stylesheet" type="text/css" href="${CONTEXT_PATH}/_back/CloudAdmin/css/responsive.css">

    <link href="${CONTEXT_PATH}/_back/CloudAdmin/font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <!-- DATE RANGE PICKER -->
    <link rel="stylesheet" type="text/css"
          href="${CONTEXT_PATH}/_back/CloudAdmin/js/bootstrap-daterangepicker/daterangepicker-bs3.css"/>
    <!-- FUELUX TREE -->
    <!-- FONTS -->
    <link href='http://fonts.useso.com/css?family=Open+Sans:300,400,600,700' rel='stylesheet' type='text/css'>
</head>
<body>
<!-- BOX -->
<div class="box border orange">
    <div class="box-title">
        <h4><i class="fa fa-sitemap"></i>菜单管理</h4>
    </div>
    <div class="box-body">
        <div >
          <section id="infoczc">

          </section>
        </div>
    </div>
</div>
<!-- /TREE VIEW  -->
<!--/PAGE -->
<!-- JAVASCRIPTS -->
<!-- Placed at the end of the document so the pages load faster -->
<!-- JQUERY -->
<script src="${CONTEXT_PATH}/_back/CloudAdmin/js/jquery/jquery-2.0.3.min.js"></script>
<!-- JQUERY UI-->
<script src="${CONTEXT_PATH}/_back/CloudAdmin/js/jquery-ui-1.10.3.custom/js/jquery-ui-1.10.3.custom.min.js"></script>
<!-- BOOTSTRAP -->
<script src="${CONTEXT_PATH}/_back/CloudAdmin/bootstrap-dist/js/bootstrap.min.js"></script>


<!-- SLIMSCROLL -->
<!-- COOKIE -->
<script type="text/javascript" src="${CONTEXT_PATH}/_back/CloudAdmin/js/jQuery-Cookie/jquery.cookie.min.js"></script>
<!-- CUSTOM SCRIPT -->
<script src="${CONTEXT_PATH}/_back/CloudAdmin/js/script.js"></script>
<script>
    jQuery(document).ready(function () {
        $.ajax({
            dataType: 'json',
            type: 'GET',
            url: '/menu/getMenuById?menuid=2',
            success: function (data) {
                $.each(data.button, function (i, item) {
                    if (item.type) {
                        if(item.type=="click"||item.type=="Click"||item.type=="CLICK"){
                            $("#infoczc").append("<button class='btn btn-block btn-primary'>" + item.type + "------" + item.name+ "------" + item.key + "</button>");
                        }else {
                            $("#infoczc").append("<button class='btn btn-block btn-primary'>" + item.type + "------" + item.name+ "------" + item.url + "</button>");
                        }

                    } else {
                        $("#infoczc").append("<button class='btn btn-block btn-primary'>" + item.name + "</button>");
                        $.each(item.sub_button, function (j, item1) {
                            if(item1.type=="click"||item1.type=="Click"||item1.type=="CLICK"){
                                $("#infoczc").append("<button style='text-align: right' class='btn btn-block btn-primary'><i class='fa fa-arrow-right text-primary'></i>" + item1.type + "------" + item1.name+ "------" + item1.key + "</button>");
                            }else {
                                $("#infoczc").append("<button style='text-align: right' class='btn btn-block btn-primary'><i class='fa fa-arrow-right text-primary'></i>" + item1.type + "------" + item1.name+ "------" + item1.url + "</button>");
                            }
                        });
                    }
                });
            }
        });
    });
</script>
<!-- /JAVASCRIPTS -->
</body>
</html>